Ext.onReady(function()
{
    var store = new X.store.Json({
        url : '/cuenta/ajax-listar',
        fields : [
            'codigoCuenta',
            'montoInicial',
            'montoActual',
            'montoEjecutado',
            'periodo',
            'nombreDepartamento',
            'nombreCentro',
            'nombreRubro',
	    'codigo',
	    'codigoNombre'
        ]
    });
	
	store.addListener('load', function(store, records, options){
       for(var i=0; i<store.getCount(); i++){
           var record = store.getAt(i);
           record.set('codigoNombre', record.get('codigo') + ' ' + record.get('nombreRubro'));
       }
    });

    new X.grid.GridPanel({

        id       : 'grid',
        title    : 'Lista de Cuentas',
        height   : 500,
        width    : 1227,
        store    : store,

        columns:[
            new X.column.Text  ({header: 'Periodo',           dataIndex: 'periodo',              width: 60}),
            new X.column.Text  ({header: 'Rubro',             dataIndex: 'codigoNombre',         width: 350}),
            new X.column.Money ({header: 'Monto Inicial',     dataIndex: 'montoInicial',         width: 130}),
            new X.column.Money ({header: 'Monto Ejecutado',   dataIndex: 'montoEjecutado',       width: 130}),
            new X.column.Money ({header: 'Monto Actual',      dataIndex: 'montoActual',          width: 130}),
            new X.column.Text  ({header: 'Departamento',      dataIndex: 'nombreDepartamento',   width: 170}),
            new X.column.Text  ({header: 'Centro de Costos',  dataIndex: 'nombreCentro',  width: 170}),

            new X.column.Edit  ({editUrl    : '/cuenta/editar',
                                 idColumn   : 'codigoCuenta'}),

            new X.column.Delete({deleteUrl  : '/cuenta/ajax-eliminar',
                                 idColumn   : 'codigoCuenta',
                                 msgName    : 'la cuenta',
                                 msgNameCol : 'codigoNombre'})
        ]
    });
});

